@babel/plugin-transform-modules-amd

What is @babel/plugin-transform-modules-amd?

The @babel/plugin-transform-modules-amd package is a plugin for Babel, a JavaScript compiler, that transforms ES2015+ modules to Asynchronous Module Definition (AMD) format. This is particularly useful for integrating modern JavaScript codebases with systems that require or benefit from the AMD module pattern, such as certain web browsers and JavaScript environments.

What are @babel/plugin-transform-modules-amd's main functionalities?

Transform ES Modules to AMD

This feature automatically converts ES2015+ import statements into AMD `define` calls, making it easier to integrate with AMD-based module systems.

import { sum } from './math';
console.log(sum(1, 2));
// Transforms to:
define(['./math'], function (_math) {
  console.log(_math.sum(1, 2));
});

Dynamic Import Support

Supports the transformation of dynamic `import()` syntax to AMD's `require` calls, enabling code splitting and lazy loading of modules in AMD environments.

import('./math').then(math => {
  console.log(math.sum(1, 2));
});
// Transforms to:
require(['./math'], function (math) {
  console.log(math.sum(1, 2));
});

Other packages similar to @babel/plugin-transform-modules-amd

@babel/plugin-transform-modules-commonjs

This package transforms ES2015+ modules to CommonJS modules, similar to how @babel/plugin-transform-modules-amd transforms modules to AMD format. It's useful for environments that support CommonJS modules, offering an alternative module system transformation.

@babel/plugin-transform-modules-umd

Similar to the AMD plugin, this Babel plugin transforms ES2015+ modules to Universal Module Definition (UMD) format. UMD modules are compatible with both CommonJS and AMD environments, making this plugin a versatile choice for projects that need to support multiple module systems.

@babel/plugin-transform-modules-systemjs

This plugin transforms ES2015+ modules to SystemJS format, another module loader system that can be used in the browser. It's an alternative to AMD for developers looking for dynamic loading and other advanced module loading features in the browser.

README

@babel/plugin-transform-modules-amd

This plugin transforms ES2015 modules to AMD

See our website @babel/plugin-transform-modules-amd for more information.

Install

Using npm:

npm install --save-dev @babel/plugin-transform-modules-amd

or using yarn:

yarn add @babel/plugin-transform-modules-amd --dev

Changelog

v7.25.9 (2024-10-22)

:bug: Bug Fix

• babel-parser, babel-template, babel-types
  • #16905 fix: Keep type annotations in syntacticPlaceholders mode (@liuxingbaoyu)
• babel-helper-compilation-targets, babel-preset-env
  • #16907 fix: support BROWSERSLIST{,_CONFIG} env (@JLHwung)
• Other
  • #16884 Analyze ClassAccessorProperty to prevent the no-undef rule (@victorenator)

:house: Internal

• babel-helper-transform-fixture-test-runner
  • #16914 remove test options flaky (@JLHwung)

:running_woman: Performance

• babel-parser, babel-types
  • #16918 perf: Make VISITOR_KEYS etc. faster to access (@liuxingbaoyu)